<template>
    <div class="content">
<!--        图片-->
        <div class="c_item2" v-if="shopFlex=='2'">
            <div class="i_header">
                    <div class="h_imgBox">
                        <img :src="prop.bgPicUrl"/>
                    </div>
                    <div class="h_logo">
                        <img :src="shopData.storeLogoUrl"/>
                    </div>
                    <div class="h_name">
                        {{shopData.storeName}}
                    </div>
            </div>
            <div class="i_content" v-if="prop.storeDesc != ''">
                {{prop.storeDesc}}
            </div>
            <div class="i_title">
                <div class="active">推荐</div>
                <div>全部</div>
                <div>新品</div>
            </div>
        </div>
    </div>
</template>
<script >

    export default {

        props: {
            prop: {
                type: Object,
                default(){
                    return {
                        bgPicUrl:"http://seopic.699pic.com/photo/50051/4111.jpg_wh1200.jpg",
                        storeDesc:"",
                    }
                }
            },
            shopData: {
                type: Object,
                default() {
                    return {};
                }
            },
            shopFlex: {
                type: String,
                default: "2"
            },
        },

        data(){
            return {
                interval:2500,
                piclist:['https://keytest.oss-cn-zhangjiakou.aliyuncs.com/upload/store/1191974507350003713/2020/04/d26e22bf81084b0eb8a32036e3b86497_968-380.jpg']
            }
        },
        mounted() {
            // this.piclist = this.prop.bgPicUrl.split(',');
        },
    }
</script>
<style lang="scss">
    .content{
        background-color: #fff;
        .c_item2{
            .i_header{
                img{
                    width: 100%;
                    height: 100%;
                    display: block;
                }
                .h_imgBox{
                    width: 100%;
                    height: 120px;
                    position:relative;
                    z-index:0;
                }
                .h_logo{
                    width: 50px;
                    height: 50px;
                    margin-top: -20px;
                    margin-left: 10px;
                    border: 1px solid #fff0fb;
                    border-radius: 1px;
                    position:relative;
                    z-index:1;
                }
                .h_name{
                    padding: 5px 10px;
                    font-size: 18px;
                    font-weight: 700;
                }
                .h_draess{
                    padding: 5px 10px;
                    font-size: 14px;
                    color: #CCCCCC;
                    span{
                        font-weight: 700;
                        color: #000000;
                    }
                }
            }
        }
        .i_content{
            padding: 10px 10px;
            line-height: 26px;
            font-size: 14px;
            word-wrap: break-word;
        }
        .i_title{
            display: flex;
            justify-content: space-around;
            font-size: 17px;
            font-weight: 700;
            .active{
                color: #fa436a;
            }
        }
    }
    .image-carsousel-swiper{
        height:145px;
    }
</style>